<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript">
        function setSessionStorage(){
            sessionStorage.setItem("msg", "我设置了sessionStorage的值");
        }

        function getSessionStorage(){
            var msg = sessionStorage.getItem("msg");
            console.debug(msg);
        }

        function removeSessionStorage(){
            sessionStorage.removeItem("msg");
        }

        function setLocalStorage(){
            localStorage.setItem("msg", "我设置了localStorage的值！！");
        }
        function getLocalStorage(){
            console.debug(localStorage.getItem("msg"));
        }
        function removeLocalStorage(){
            localStorage.removeItem("msg");
        }
       /*
        sessionStorage和localStorage的共同点： 把数据存储到浏览器上面，并且在浏览器上获取存储的值

         sessionStorage和localStorage的区别：
                    sessionStorage设置的值，只在当前窗体生效
                    localStorage设置的值,永久性存储

        */
    </script>
</head>
<body>
<button onclick="setSessionStorage()">设置sessionStorage的值</button>
<button onclick="getSessionStorage()">获取sessionStorage的值</button>
<button onclick="removeSessionStorage()">删除sessionStorage的值</button>
<button onclick="setLocalStorage()">设置localStorage的值</button>
<button onclick="getLocalStorage()">获取localStorage的值</button>
<button onclick="removeLocalStorage()">删除localStorage的值</button>

</body>
</html>